<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta content="" name="description" />
    <meta content="webthemez" name="author" />
    <meta http-equiv="pragram" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache, must-revalidate">
    <meta http-equiv="expires" content="0">

    <title>Bootstrap Admin Template</title>
    <!-- Bootstrap Styles-->
    <link href="assets/css/bootstrap.css" rel="stylesheet" />
    <!-- FontAwesome Styles-->
    <link href="assets/css/font-awesome.css" rel="stylesheet" />
    <link href="assets/css/select2.min.css" rel="stylesheet" >
    <link href="assets/css/checkbox3.min.css" rel="stylesheet" >
    <!-- Custom Styles-->
    <link href="assets/css/custom-styles.css" rel="stylesheet" />
    <!-- Google Fonts-->
    <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css' />
    <link href="assets/css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
</head>
<body>
<div id="page-wrapper">

    <div class="header">
        <h1 class="page-header">
            论文分组
        </h1>

    </div>


    <div id="page-inner">
        <div class="row">
            <div class="col-md-6">
                <!--   Kitchen Sink -->
                <div class="panel panel-default">
                    <div class="panel-heading">
                        未分组学生
                    </div>
                    <div class="panel-body">
                        <div class="table-responsive">
                            <table class="table table-striped table-bordered table-hover">
                                <thead>
                                <tr>
                                    <th>学号</th>
                                    <th>姓名</th>
                                    <th>课题</th>
                                    <th>选择评阅老师</th>
                                </tr>
                                </thead>
                                <tbody id="stulist">

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <!-- End  Kitchen Sink -->
            </div>
            <div class="col-md-6">
                <!--   Basic Table  -->
                <div class="panel panel-default">
                    <div class="panel-heading">
                        待分组学生
                    </div>
                    <div class="panel-body">
                        <div class="table-responsive">
                            <table class="table">
                                <thead>
                                <tr>
                                    <th>学号</th>
                                    <th>姓名</th>
                                    <th>课题</th>
                                    <th>评阅老师</th>
                                    <th>删除</th>
                                </tr>
                                </thead>
                                <tbody id="prestulist">

                                </tbody>
                                <tfoot>
                                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal2"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>分组</button>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
                <!-- End  Basic Table  -->
            </div>
        </div>


    </div>

</div>
<!--选择评阅老师-->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                <h4 class="modal-title" id="myModalLabel">选择评阅老师</h4>
            </div>
            <div class="modal-body">
                <div class="panel panel-default">
                    <!-- /.panel-heading -->
                    <div class="panel-body">
                        <div class="table-responsive table-bordered">
                            <table class="table">
                                <thead>
                                <tr>
                                    <th>教工号</th>
                                    <th>姓名</th>
                                    <th>选择</th>
                                </tr>
                                </thead>
                                <tbody id="teacherlist">
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>关闭</button>
                <!--<button type="button" id="btn_submit" class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>撤销申请</button>-->
            </div>
        </div>
    </div>
</div>

<!--分组表单-->
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                <h4 class="modal-title" id="myModalLabel2">分组</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" id="form">
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><span style="color:red">*</span>主持人</label>
                        <div class="col-sm-10">
                            <select name="teachers" id="teachers" aria-controls="dataTables-example" class="form-control input-sm">
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><span style="color:red">*</span>答辩地点</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="address" placeholder="答辩地点" width="30px">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><span style="color:red"> *</span>答辩时间</label>
                        <div class="col-sm-10">
                            <div class="input-group date form_datetime col-md-5" data-date="2017-11-01T05:25:07Z" data-date-format="yyyy-mm-dd hh:ii:ss" data-link-field="dtp_input1">
                                <input class="form-control" size="16" type="text" value="" readonly id="date">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
                                <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
                            </div>
                            <input type="hidden" id="dtp_input1" value="" /><br/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><span style="color:red">*</span>答辩类别</label>
                        <div class="col-sm-10">
                            <div class="radio3 radio-check radio-inline">
                                <input type="radio" id="radio4" name="radio" value="一辩" checked="">
                                <label for="radio4">
                                    一辩
                                </label>
                            </div>
                            <div class="radio3 radio-check radio-success radio-inline">
                                <input type="radio" id="radio5" name="radio" value="二辩">
                                <label for="radio5">
                                    二辩
                                </label>
                            </div>

                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                            <input type="button" class="btn btn-default" onclick="addGroup()" data-dismiss="modal" value="确定">
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>关闭</button>
            </div>
        </div>
    </div>
</div>

<!--ajax-->
<script src="assets/js/jQuery-2.1.4.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/pageGroup.js"></script>
<!--<script type="text/javascript">-->
<!--function showdialog(){-->
<!--$('#myModal').modal();-->
<!--}-->
<!--</script>-->
<!-- /. WRAPPER  -->
<!-- JS Scripts-->
<!-- jQuery Js -->
<script src="assets/js/jquery-1.10.2.js"></script>
<!-- Bootstrap Js -->
<script src="assets/js/bootstrap.min.js"></script>
<!-- Metis Menu Js -->
<script src="assets/js/jquery.metisMenu.js"></script>
<script src="assets/js/select2.full.min.js"></script>
<!-- Custom Js -->
<script type="text/javascript" src="assets/js/bootstrap-datetimepicker.js" charset="UTF-8"></script>
<script type="text/javascript" src="assets/js/bootstrap-datetimepicker.fr.js" charset="UTF-8"></script>
<script type="text/javascript">
    $('.form_datetime').datetimepicker({
        //language:  'fr',
        weekStart: 1,
        todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        forceParse: 0,
        showMeridian: 1
    });
    $('.form_date').datetimepicker({
        language:  'fr',
        weekStart: 1,
        todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        minView: 2,
        forceParse: 0
    });
    $('.form_time').datetimepicker({
        language:  'fr',
        weekStart: 1,
        todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 1,
        minView: 0,
        maxView: 1,
        forceParse: 0
    });
</script>
<script>
    var jsonObj = { stu: []};
    function show() {
        var re=getResponse('/user/findByAddStateIn/THESIS_ONE_PASS/10/0');
        var tmp='';
        for(var i = 0 ;i<re.responseJSON.content.length;i++) {
            var flag = 0;
            for (var j = 0; j < jsonObj.stu.length; j++) {
                if (jsonObj.stu[j].sid == re.responseJSON.content[i].id) {
                    flag = 1;
                    break;
                }
            }
            if (flag == 0) {
                var topicname = showtopicname(re.responseJSON.content[i].topicId);
                tmp += '<tr>'
                    + '<td>' + re.responseJSON.content[i].username + '</td>'
                    + '<td>' + re.responseJSON.content[i].realname + '</td>'
                    + '<td>' + topicname + '</td>'
                    + '<td><a href="#" class="btn btn-success" ' +
                    'onclick="showTeachers(\'' + re.responseJSON.content[i].id + '\',\'' + re.responseJSON.content[i].realname + '\',\'' + re.responseJSON.content[i].topicId + '\')" data-toggle="modal" data-target="#myModal">选择评阅老师</a></td>'
                    + '</tr>'
            }
            document.getElementById("stulist").innerHTML = tmp;
        }

    }
    function showtopicname(topicid){
        var r=getResponse('/topic/findNameById/'+topicid);
        console.log(r);
        return r.responseText;
    }
    function showTeachers(id,sturealname,topicId) {
        var re=getResponse('/user/findByNotOfStu/'+id);
        console.log(re);
        var tmp='';
        for(var i = 0 ;i<re.responseJSON.length;i++){
            tmp+='<tr>'
                +'<td>'+re.responseJSON[i].username+'</td>'
                +'<td>'+re.responseJSON[i].realname+'</td>'
                +'<td><a href="#" class="btn btn-success btn-sm" ' +
                'onclick="chooseTeacher(\''+re.responseJSON[i].id+'\',\''+re.responseJSON[i].realname+'\',\''+sturealname+'\',\''+id+'\',\''+topicId+'\')" data-toggle="modal" data-target="#myModal">选择</a></td>'
                +'</tr>'
        }
        document.getElementById("teacherlist").innerHTML=tmp;
    }
    function chooseTeacher(tid,trealname,srealname,sid,topicId) {
        var topicname=showtopicname(topicId);
        var temp = {
            teacherId: tid,
            teacherName: trealname,
            stuName: srealname,
            stuId:sid,
            topicId:topicId,
            topicName:topicname};
        jsonObj.stu.push(temp);
        show();
        showprestu();
    }
    function showprestu() {
        var tmp='';
        for (var i = 0; i < jsonObj.stu.length; i++) {
            tmp+='<tr>'
                +'<td>'+showStu(jsonObj.stu[i].stuId)+'</td>'
                +'<td>'+jsonObj.stu[i].stuName+'</td>'
                +'<td>'+jsonObj.stu[i].topicName+'</td>'
                +'<td>'+jsonObj.stu[i].teacherName+'</td>'
                +'<td class="center"><a href="#" class="btn btn-success" onclick="deleteData(\''+jsonObj.stu[i].stuId+'\')" >删除</a></td>'
                +'</tr>'
        }
        document.getElementById("prestulist").innerHTML=tmp;
    }
    function showStu(id){
        var re=getResponse('/user/find/'+id);
        return re.responseJSON.username
    }
    function deleteData(id) {
        var stu = jsonObj.stu;
        //alert(name);
        for (var i = 0; i < stu.length; i++) {
            var cur_stu = stu[i];
            if (cur_stu.stuId == id) {
                jsonObj.stu.splice(i, 1);
            }
        }
        show();
        showprestu();
    }
    function showhost(){
        var re=getResponse('/user/findTeacher');
        var tmp = '<option value="" selected="selected">全部</option>';
        for (var i = 0; i < re.responseJSON.length; i++) {
            tmp += '<option value='+re.responseJSON[i].id+'>'
                + re.responseJSON[i].realname + '</option>';
        }
        document.getElementById("teachers").innerHTML = tmp;
    }
    function addGroup(){
        var host=document.getElementById("teachers").value;
        var address=document.getElementById("address").value;
        var date=document.getElementById("date").value;
        var countTypeflag=document.getElementsByName("radio")[0].checked;
        var record=JSON.stringify(jsonObj.stu);
        if(countTypeflag==true){
            var countType="一辩";
        }else{
            var countType="二辩";
        }
        alert(countType);
        var formData=new FormData();
        formData.append("host",host);
        formData.append("address",address);
        formData.append("date",new Date(date));
        formData.append("countType",countType);
        formData.append("type",1);
        formData.append("record",record);
        var re=getResponse("/group/addGroup",formData,"multipart/form-data")
        alert("分组成功！");
        jsonObj = { stu: []};
        show();
        showprestu();
    }
    show();
    showhost();

</script>

</body>
</html>
